{include file="common:lay_header" /}
<style>
    table.layui-table {
        height: 80px;
    }
    .layui-table-cell {
        height: 60px;
    }
    .layui-table-cell {
        height: 53px;
        text-align: center;
        line-height: 50px;
    }
</style>
<body>
<table class="layui-hide" id="demo" lay-filter="test"></table>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script src="__LAYUI__/layui.js"></script>
<script>

    layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element', 'slider'], function(){
        var table = layui.table //表格

        //执行一个 table 实例
        table.render({
            elem: '#demo'
            ,url: "{:url('ajax')}" //数据接口
            ,title: '用户表'
            ,page: true //开启分页
            ,toolbar: 'default' //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
            ,cols: [[ //表头
                {type: 'checkbox', fixed: 'left'}
                ,{field: 'id', title: 'ID', width:180, sort: true}
                ,{field: 'name', title: '标题'}
                ,{field: 'content', title: '内容'}
                ,{field: 'value',title:'值'}
                ,{field: 'create_time', title: '创建时间'}
                ,{fixed: 'right', width: 165, align:'center', toolbar: '#barDemo'}
            ]],
            id: 'testReload'
        });

        //监听头工具栏事件
        table.on('toolbar(test)', function(obj){
            _toolbar(obj,table,'80%','70%')
        });

        //监听行工具事件
        table.on('tool(test)', function(obj){
            _tool(obj,'80%','70%')
        });

    });
</script>

<script type="text/html" id="image">
    <div><img src="{{d.image}}" alt="轮播图" width="120px"></div>
</script>

</body>
</html>
